@page "/Register"
@layout Layout.EmptyLayout

<EditForm Model="@_model" OnValidSubmit="OnRegisterSubmit">
    <DataAnnotationsValidator/>
    <MudGrid>
        <MudItem xs="12" sm="7">
            <MudCard>
                <MudCardHeader>
                    <CardHeaderAvatar>
                        <MudAvatar Color="Color.Secondary">Hi</MudAvatar>
                    </CardHeaderAvatar>
                    <CardHeaderContent>
                        <MudText Typo="Typo.body1">熊猫管理系统</MudText>
                        <MudText Typo="Typo.body2">请注册账号！</MudText>
                    </CardHeaderContent>
                </MudCardHeader>
                <MudCardContent>
                    <MudTextField Label="用户名" HelperText="最大 20 个字符"
                                  @bind-Value="_model.Name" For="@(() => _model.Name)"/>
                    <MudTextField Label="电子邮件" Class="mt-3"
                                  @bind-Value="_model.Email" For="@(() => _model.Email)"/>
                    <MudTextField Label="密码" HelperText="密码必须包含字母、数字和特殊字符" Class="mt-3"
                                  @bind-Value="_model.Password" For="@(() => _model.Password)"
                                  InputType="InputType.Password"/>
                    <MudTextField Label="确认密码" HelperText="重复上面的密码" Class="mt-3"
                                  @bind-Value="_model.ConfirmPassword" For="@(() => _model.ConfirmPassword)"
                                  InputType="InputType.Password"/>
                </MudCardContent>
                <MudCardActions>
                    <MudButton ButtonType="ButtonType.Submit" Variant="Variant.Filled" Color="Color.Primary"
                               Class="ml-auto">注册
                    </MudButton>
                </MudCardActions>
            </MudCard>
        </MudItem>
        <MudItem xs="12" sm="5">
            <MudPaper Class="pa-4 mud-height-full">
                <MudText Typo="Typo.subtitle2">校验摘要</MudText>
                @if (_success)
                {
                    <MudText Color="Color.Success">成功</MudText>
                }
                else
                {
                    <MudText Color="@Color.Error">
                        <ValidationSummary/>
                    </MudText>
                }
            </MudPaper>
        </MudItem>
        <MudItem xs="12">
            <MudText Typo="Typo.body2" Align="Align.Center">
                正确填写表单后，点击注册按钮
            </MudText>
        </MudItem>
    </MudGrid>
</EditForm>


@code {
    RegisterData _model = new();
    bool _success;

    private async Task OnRegisterSubmit(EditContext context)
    {
        _success = true;
        var registerResult = await AccountService.RegisterAsync(_model);
        if (registerResult.IsSuccess)
        {
            Snackbar.Add(registerResult.Message!, Severity.Success);
            _model = new RegisterData();
        }
        else
        {
            _success = false;
        }

        StateHasChanged();
    }

}